<template>
	<view class="content">
		<view class="top">
			<view class="top-d1">
				<!-- {
					"id":2,
					"venueId":"2f56c0ce-98f0-4a80-bd8e-85dfbec02ee9",
					"memberUserId":null,
					"coachCode":"ffb7-4ee1-9508",
					"coachName":"王旭",
					"coachPhone":"13212341234",
					"coachPassword":"$2a$10$bJd5e4ampYpapCRJ7FslxulVdPrEkbJYb/w.DaAy5V8QdSxFBwZTC",
					"coachImg":"6215,6216,6217,6218,6219",
					"coachTeachingTimes":8,"
					coachInformation":"123",
					"coachSpecialty":"123",
					"coachExperience":"123",
					"createTime":1699429417000,
					"updateTime":1701066616000,
					"delFlag":"0"
				} -->
				<view style="width: 30%;height: 13vh;margin: 0 auto;">
					<image :src="'http://101.43.223.224:8765/image/getImageById?id=' + form.coachImg[0]" style="height: 13vh;width: 13vh;border-radius: 13vh;"></image>
				</view>
				
			</view>
			<view class="top-d2">
				<view style="width: 30%; height: 10vh; float: left; display: flex; justify-content: center; align-items: center;">
				    <view style="width: 8vh; height: 8vh; border-radius: 2px;">
						<image v-if="qrCodeUrl" :src="qrCodeUrl" mode="aspectFit" style="width: 8vh; height: 8vh;" @tap="previewImage()"></image>
					</view>
				</view>
				<view style="width: 70%; height: 10vh; float: left; ">
				    <view style="width: 100%; height: 10vh;display: flex; align-items: center;letter-spacing: 5rpx;">
						  
						<text style="">邀请码:{{form.coachCode}}</text>
					</view>
				</view>
			</view>
		</view>
		<view class="body">
			<view class="body-d1">
				<view class="body-d1-d"  @tap="upName()">
					<view class="body-d1-d-d1">
						<text style="text-indent:20rpx;font-size: 30rpx;">教练姓名</text>
					</view>
					<view class="body-d1-d-d2">
						<text style="font-size: 28rpx;">{{form.coachName}} </text>
						<u-icon name="arrow-right" size="35rpx"></u-icon>
					</view>
				</view>
				<view class="body-d1-d"  @tap="upSex()">
					<view class="body-d1-d-d1">
						
						<text style="text-indent: 20rpx;font-size: 30rpx;">教练性别</text>
					</view>
					<view class="body-d1-d-d2">
						
						<text style="font-size: 28rpx;">{{form.coachSex=='0'?'女':form.coachSex=='1'?'男':'第三性'}} </text>
						<u-icon name="arrow-right" size="30rpx"></u-icon>
					</view>
				</view>
				<view class="body-d1-d">
					<view class="body-d1-d-d1">
						
						<text style="text-indent: 20rpx;font-size: 30rpx;">所属场馆</text>
					</view>
					<view class="body-d1-d-d2">
						<text style="font-size: 28rpx;">{{form.userName}} </text>
					</view>
				</view>
				<view class="body-d1-d">
					<view class="body-d1-d-d1">
						
						<text style="text-indent: 20rpx;font-size: 30rpx;">手机号</text>
					</view>
					<view class="body-d1-d-d2">
						<text style="font-size: 28rpx;">{{form.coachPhone}} </text>
					</view>
				</view>
				<view class="body-d1-d" @tap="shengqing()">
					<view class="body-d1-d-d1">
						<text style="text-indent: 20rpx;font-size: 30rpx;">学员申请</text>
					</view>
					<view class="body-d1-d-d2">
						<u-icon name="arrow-right" size="30rpx"></u-icon>
					</view>
				</view>
				<view class="body-d1-d" @tap="mytime()">
					<view class="body-d1-d-d1">
						<text style="text-indent: 20rpx;font-size: 30rpx;">我的时间</text>
					</view>
					<view class="body-d1-d-d2">
						<u-icon name="arrow-right" size="30rpx"></u-icon>
					</view>
				</view>
				<view class="body-d1-d" @tap="upPassword()">
					<view class="body-d1-d-d1">
						
						<text style="text-indent: 20rpx;font-size: 30rpx;">修改密码</text>
					</view>
					<view class="body-d1-d-d2">
						<u-icon name="arrow-right" size="30rpx"></u-icon>
					</view>
				</view>
				<view class="body-d1-d" @tap="outlogin()">
					<view class="body-d1-d-d1">
						<text style="text-indent: 20rpx;font-size: 30rpx;">退出登录</text>
					</view>
					<view class="body-d1-d-d2">
						<u-icon name="arrow-right" size="30rpx"></u-icon>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				form:{},
				qrCodeUrl: ''
			}
		},
		onShow() {
			this.selelctInfo()
		},
		methods: {
			outlogin(){
				uni.removeStorageSync('teacherinfo');
				uni.navigateTo({
					url: '/pages/index/index'
				})
			},
			upName(){
				uni.navigateTo({
					url: '/pages/Pesonal/UpName?item='+JSON.stringify(this.form)
				})
			},
			upSex(){
				uni.navigateTo({
					url: '/pages/Pesonal/UpSex?item='+JSON.stringify(this.form)
				})
			},
			upPassword(){
				uni.navigateTo({
					url: '/pages/Pesonal/upPassword?item='+JSON.stringify(this.form)
				})
			},
			mytime(){
				uni.navigateTo({
					url:'/pages/Pesonal/TrainingTime?item='+JSON.stringify(this.form)
				})
			},
			previewImage() {
			    wx.previewImage({
			      urls: [this.qrCodeUrl], // 预览的图片链接数组
			      current: this.qrCodeUrl, // 当前显示的图片链接
			    });
			  },
			selelctInfo(){
				var ths = this;
				uni.request({
					url: 'http://127.0.0.1:17000/AppCoach/getCoachById',
					method: 'GET',
					data: {
						id: uni.getStorageSync('teacherinfo').id
					},
					success: function(res) {
						if (res.data.code == 200) {
							ths.form = res.data.data
							  const content = ths.form.coachCode; // 替换为你要生成二维码的内容
							
							  uni.request({
							    url: 'http://127.0.0.1:17000/Article/generateQRCode',
							    method: 'POST',
							    data: content,
							    responseType: 'arraybuffer',
							    success: (res) => {
							      const base64 = uni.arrayBufferToBase64(res.data);
							      ths.qrCodeUrl = 'data:image/png;base64,' + base64;
							    },
							    fail: (err) => {
							      console.error(err);
							    }
							  });
							  ths.form.coachPhone = ths.form.coachPhone.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2');
							if (ths.form.coachImg.includes(',')) {
							  let splitImages = ths.form.coachImg.split(',');
							  ths.form.coachImg=splitImages
							} else {
								let arr=[]
								arr.push(ths.form.coachImg)
								ths.form.coachImg=arr
								
							}
						} else {
							uni.showToast({
								title: '操作失败',
								icon: 'error',
								duration: 2000
							});
						}
				
					},
					fail: function(error) {
						// 处理请求失败
						console.error('上传课程失败，请检查网络');
					}
				})
			},
			shengqing(){
				uni.navigateTo({
					url:"/pages/Pesonal/shengqing"
				})
			}
		}
	}
</script>

<style>
.body-d1-d{
	width: 100%;
	height: 80rpx;
	margin-top:20rpx;
	border-bottom:1px solid #e7e7e7;
}
.body-d1-d-d1{
	width: 30%;
	height: 80rpx;
	display: flex;
	align-items: center;
	float: left;
}
.body-d1-d-d2{
	width: 65%;
	height: 80rpx;
	display: flex;
	align-items: center;
	justify-content:flex-end;
	float: left;
}
.content {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}
.top {
	height: 30vh;
	width: 100%;
	background-image: linear-gradient(to bottom, #94A9FD, #9ECFFF, #b9e1ff,#fff);
}
.top-d1 {
	width: 90%;
	height: 13vh;
	margin: 0 auto;
	margin-top:5vh;
	
}
.top-d2 {
	width: 90%;
	height: 10vh;
	box-sizing: border-box;
	box-shadow: 0 2px 10px #dfdfdf;
	background-color: #fff;
	margin: 0 auto;
	margin-top:2vh;
	border-radius: 10px;
	
}
.body {
	margin-top: 20px;
	width:100%;
	height: 100%;
	overflow: auto;
	box-sizing: border-box;
}
.body-d1{
	width: 90%;
	min-height: 40vh;
	height: auto;
	margin: 0 auto;
	
	box-sizing: border-box;
	padding: 15px;
	box-shadow: 0 2px 10px #dfdfdf;
	background-color: #fff;
	border-radius: 6px;
	overflow: visible;
}
</style>
